<!DOCTYPE html> 
<html>
<head>
	<title>修改新歌</title>
	
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<meta http-equiv="Cache-Control" content="no-store" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />

<meta name="apple-touch-fullscreen" content="YES">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">

<link type="image/x-icon" href="/PracticalTraining/static/images/favicon.ico" rel="shortcut icon">
<link href="/PracticalTraining/static/bootstrap/2.3.2/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
<link href="/PracticalTraining/static/jquery-validation/1.11.1/validate.css" type="text/css" rel="stylesheet" />
<link href="/PracticalTraining/static/styles/default.css" type="text/css" rel="stylesheet" />

<script src="/PracticalTraining/static/jquery/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="/PracticalTraining/static/jquery-validation/1.11.1/jquery.validate.min.js" type="text/javascript"></script>
<script src="/PracticalTraining/static/jquery-validation/1.11.1/messages_bs_zh.js" type="text/javascript"></script>

<script type="text/javascript" src="static/js/jqmobi.js"></script>

<script src="/PracticalTraining/static/js/url.js" type="text/javascript"></script>

	<script>
	
		var qid = $.getUrlParam('id');
		var param = {id : qid};
		/*
		   根据id加载歌曲，并填充修改的表单
		*/
		$.get(url.SONG(qid),param, function(data){
			   $("#songName").val(data.songName) ;
			   $("#singer").val(data.singer);
			   $("#album").val(data.album);
			   $("#fileName").val(data.fileName);
			   $("#imageName").val(data.imageName);
		});
	
	var songForm = function(){
		//json格式:{songName : '大王来巡山'，singer:'贾乃亮'}
		var param = {
				  songName : $("#songName").val(),
				  singer : $("#singer").val(),
				  album : $("#album").val(),
				  fileName : $("#fileName").val(),
				  imageName : $("#imageName").val(),
				};
		
		$.get(url.NEW_SONG,param, function(data){
			if(data == "true"){
				$("#message").show();
			}
		});
	};
	
	var showSong = function(){
		window.location.href = window.url.LIST_SONG;
	};
	</script>
</head>

<body>
<div id="message" class="alert alert-success" style="display:none;"><button data-dismiss="alert" class="close">×</button>添加成功</div>
	<form id="inputForm" action="/PracticalTraining/song/newSong" method="get" class="form-horizontal">
		<fieldset>
			<legend><small>添加新歌</small></legend>
			<div class="control-group">
				<label for="songName" class="control-label">歌名:</label>
				<div class="controls">
					<input type="text" id="songName" name="songName" class="input-large required" minlength="3"/>
				</div>
			</div>
			<div class="control-group">
				<label for="singer" class="control-label">歌手:</label>
				<div class="controls">
					<input type="text" id="singer" name="singer" class="input-large required"/>
				</div>
			</div>
			<div class="control-group">
				<label for="album" class="control-label">专辑:</label>
				<div class="controls">
					<input type="text" id="album" name="album" class="input-large required"/>
				</div>
			</div>
			<div class="control-group">
				<label for="fileName" class="control-label">文件名:</label>
				<div class="controls">
					<input type="text" id="fileName" name="fileName" class="input-large required"/>
				</div>
			</div>
			<div class="control-group">
				<label for="imageName" class="control-label">图片名:</label>
				<div class="controls">
					<input type="text" id="imageName" name="imageName" class="input-large required"/>
				</div>
			</div>
			<div class="form-actions">
				<input id="submit_btn" class="btn btn-primary" type="button" onclick = "songForm()" value="提交"/>&nbsp;	
				<input id="cancel_btn" class="btn" type="button" value="查看" onclick="showSong()"/>
			</div>
		</fieldset>
	</form>
</body>
</html>
